<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div th:fragment="html">
    <script>
        $(function(){
            var deposit_id = getUrlParms("out_trade_no");
            var trade_no = getUrlParms("trade_no");
            var refund_amount = getUrlParms("total_amount");
            var data4Vue = {
                uri:'/refund',
                deposit_id:0,
                trade_no:0,
                refund_amount:0.0,
                WIDTRrefund_reason:'测试退款是否成功',
                WIDTRout_request_no:0
            };
            //ViewModel
            var vue = new Vue({
                el: '#workingArea',
                data: data4Vue,
                mounted:function(){ //mounted　表示这个 Vue 对象加载成功了
                    this.refund_amount = refund_amount;
                    this.deposit_id = deposit_id;
                    this.trade_no = trade_no;

                    this.load();
                },
                methods: {
                    load:function(){
                        var url =  this.uri+"?deposit_id="+deposit_id
                            +"?refund_amount="+refund_amount+"?trade_no="+trade_no
                            +"?WIDTRrefund_reason="+WIDTRrefund_reason
                            +"?WIDTRout_request_no="+WIDTRout_request_no;
                        axios.get(url).then(function(response) {
                            vue.order = response.data;
                        });
                    }
                }
            });

        })
    </script>

    <div class="payedDiv">
        <div class="payedTextDiv">
            <img src="img/site/paySuccess.png">
            <span>您已经缴纳保证金！！！</span>
        </div>
        <div class="payedAddressInfo">
            <ul>
                <!--<li>收货地址：{{order.address}} {{order.receiver}} {{order.mobile }}</li>-->
                <li>保证金已缴纳费用:{{refund_amount}}</li>
                <li>保证金订单号:{{deposit_id}}</li>
                <li>支付宝号:{{trade_no}}</li>
            </ul>

            <!--退款成功后无法点击，并弹出提示框告知退款成功-->

            <div class="paedCheckLinkDiv">
                <a class="payedCheckLink" href="/tmall_springboot">立即参与竞拍</a>
                <a :href="'refund?deposit_id='+deposit_id+'&refund_amount='+refund_amount+'&trade_no='+trade_no+'&WIDTRrefund_reason='+WIDTRrefund_reason+'&WIDTRout_request_no='+WIDTRout_request_no">
                    <button>申请退款</button></a>
            </div>
            <!--<a class="payedCheckLink" href="/tmall_springboot/refund?-->
                <!--user_id-->
                <!--&deposit_id-->
                <!--&money-->
                <!--&WIDTRrefund_reason=测试一次-->
                <!--&WIDTRout_request_no=123456">保证金申请退款</a>-->
        </div>

        <div class="payedSeperateLine">
        </div>

        <div class="warningDiv">
            <img src="img/site/warning.png">
            <b>安全提醒：</b>下单后，<span class="redColor boldWord">用QQ给您发送链接办理退款的都是骗子！</span>谨防假冒客服电话诈骗！
        </div>
    </div>
</div>
</div>
</body>
</html>